<html>
    <head>
        <title>Event Social - Under Construction</title>
        <style type='text/css'>
            body { background: #474747 }
            .inset-typo {
                font-size: 30px; 
                text-transform: uppercase;
                color: #222;
                text-shadow: 0px 2px 3px #666;
            }
            #counter {
                font-family: "League-Gothic", Courier;
                font-size: 40px; 
                text-transform: uppercase;
                color: #fff;
                text-shadow: 0 0 20px #fefcc9, 10px -10px 30px #feec85, -20px -20px 40px #ffae34, 20px -40px 50px #ec760c, -20px -60px 60px #cd4606, 0 -80px 70px #973716, 10px -90px 80px #451b0e;
            }
        </style>
        <script type='text/javascript' src='/media/js/String.js'></script>
        <script type='text/javascript'>
            var counter = 0;
            
            function setUpCounter() {
                var xmlhttp;
                if (window.XMLHttpRequest)
                {// code for IE7+, Firefox, Chrome, Opera, Safari
                    xmlhttp=new XMLHttpRequest();
                }
                else
                {// code for IE6, IE5
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
                
                xmlhttp.open("GET", "/counter/", false);
                xmlhttp.send();
                
                counter = xmlhttp.responseText;
                
                updateCounter();
            };
            
            function updateCounter() {
                var days = Math.round(counter / (3600 * 24));
                var hours = Math.round((counter % (3600 * 24)) / 3600);
                var minutes = Math.round(((counter % (3600 * 24)) % 3600) / 60);
                var seconds = Math.round(((counter % (3600 * 24)) % 3600) % 60);
                
                document.getElementById('counter').innerHTML = '%d days and %02d:%02d:%02d' .sprintf(
                    days, hours, minutes, seconds
                    );
                
                counter--;
            };
        </script>
    </head>
    <body onload="javascript: setUpCounter(); setInterval('updateCounter()', 1000)">
        <div align='center'>
            <img src='/media/img/under_construction.png'></img>
            <p class='inset-typo'>Event Social is coming shortly</p>
            <p id='counter'></p>
        </div>        
    </body>
</html>